﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd">
<html>
<head>
<title>VisibilityWatcher demo #3</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
	body { font-family: Arial, Helvetica; background-color: #C0C0C0; }
	p#status { padding:10px; background:#F0F0FF; margin-top:20%; }
	p.explanation { background-color: #FFFFFF; border: 2px dashed black; }
	div#flyer { position:fixed; top:0px; left:200px; background-color:#F0F0F0; border:2px solid black; height:50px; width:50px; text-align:center; }
</style>
</head>
<body>
<h1>VisibilityWatcher demo #2</h2>
<p class="explanation">Here's an animated element detection demo.<br/>The smiley in the middle of the screen keeps track of its moving friend.</p>
<div id="flyer">:)</div>
<p id="status">Some text you should not see</p>
<script type="text/javascript" charset="utf-8" src="../../../../src/loader.js"></script>
<script type="text/javascript">	HmJS.$JSManager.$basepath = '../../../../src/'; </script>
<script type="text/javascript" charset="utf-8" src="../../../../src/demo/action/util/dom/visibilitywatcher3.js"></script>
</body>
</html>